<template>
  <el-dialog :model-value="dialogVisible" title="系统提示" width="600px" :before-close="handleClose">
    <div class="userCardInfo">
      <el-image class="userCardInfo__avatar" :src="avatar" :preview-src-list="[avatar]"></el-image>
      <div class="userCardInfo__con">
        <el-form ref="formRef" :model="curRow" label-width="120px">
          <el-form-item label="姓名">
            <el-input placeholder="请输入姓名" v-model="curRow.empname"></el-input>
          </el-form-item>
          <el-form-item label="物理卡号UID">
            <el-input placeholder="请输入物理卡号UID" v-model="cardUid" disabled></el-input>
          </el-form-item>
        </el-form>
      </div>
    </div>

    <el-button class="downloadExe" type="danger" :icon="Download" link @click="_downloadExe">下载服务程序</el-button>
    <template #footer>
      <span class="dialog-footer">
        <el-button type="warning" plain :loading="loading" v-if="handleType === 1" @click="_sendCard">发卡</el-button>
        <el-button type="warning" plain :loading="loading" v-if="handleType === 2" @click="_changeCard">换卡</el-button>
        <el-button type="warning" plain :loading="loading" v-if="handleType === 3" @click="_activityCard">激活</el-button>
        <el-button type="danger" plain :loading="loading1" @click="_rewriteCard">重写</el-button>
        <el-button @click="handleClose">取消</el-button>
      </span>
    </template>
  </el-dialog>
</template>
<script setup lang="tsx" name="CardHandleDialog">
import { ref, watch } from "vue";
import { ElMessage } from "element-plus";
import { Download } from "@element-plus/icons-vue";
import { msgMap, VITE_API_URL } from "@/config";
import { convertImageToBase64, downloadEvt, getAssetsFile } from "@/utils";
import { getUid } from "@/api/modules/common";
import { activityCard, changeCard, rewriteCard, sendCard } from "@/api/modules/cardIssuingCenter/virtualCardManage";

const props = defineProps<{
  curRow: { [key: string]: any };
  handleType: number;
  dialogVisible: boolean;
  handleClose: () => void;
}>();

const emit = defineEmits(["writeCardSuc"]);

watch(
  () => props.dialogVisible,
  () => {
    avatar.value = getAssetsFile("images/user.gif");
    convertImageToBase64(`${VITE_API_URL}/employee/photo/download?empid=${props.curRow?.empid}`, (base64Value: string) => {
      avatar.value = base64Value;
    });
  }
);

const loading = ref(false);
const loading1 = ref(false);

const avatar = ref("");
const cardUid = ref("");
/**
 * 下载文件
 */
const _downloadExe = () => {
  downloadEvt(getAssetsFile("file/serviceSetup.exe"), "serviceSetup.exe");
};

/**
 * 发卡
 */
const _sendCard = () => {
  loading.value = true;
  getUidFunc({ reqFunc: sendCard });
};

/**
 * 换卡
 */
const _changeCard = () => {
  loading.value = true;
  getUidFunc({ reqFunc: changeCard });
};

/**
 * 激活
 */
const _activityCard = () => {
  loading.value = true;
  getUidFunc({ reqFunc: activityCard });
};

/**
 * 重写
 */
const _rewriteCard = () => {
  loading1.value = true;
  getUidFunc({ reqFunc: rewriteCard, isRewrite: true });
};

/**
 * 获取Uid
 */
const getUidFunc = async opts => {
  const { reqFunc, isRewrite, cb } = opts;
  try {
    const data = (await getUid(9)) as { msgCode: string | number; msgName: string };
    if (data.msgCode == 0) {
      cardUid.value = data.msgName;
      reqFunc && doWriteCard(reqFunc, isRewrite ?? false);
      cb && cb(data.msgName);
    } else if (data.msgCode == -2) {
      ElMessage.error(msgMap.get(13));
    } else if (data.msgCode == -38) {
      ElMessage.error(msgMap.get(14));
    } else if (data.msgCode == -5) {
      ElMessage.error(msgMap.get(30));
    } else if (data.msgCode == -100) {
      ElMessage.error(msgMap.get(-1));
    } else {
      ElMessage.error(msgMap.get(15));
    }
    if (data.msgCode !== 0) {
      loading.value = false;
      loading1.value = false;
    }
  } catch (error) {
    loading.value = false;
    loading1.value = false;
    console.log(error);
  }
};

/**
 * 写卡
 */
const doWriteCard = async (reqFunc: Function, isRewrite) => {
  const params = {
    id: props.curRow.empid,
    stringParam1: cardUid.value
  };
  if (cardUid.value.length < 8) {
    ElMessage.error(msgMap.get(11));
    return false;
  }
  try {
    await reqFunc(params);
    if (isRewrite) {
      ElMessage.success("重写成功");
      loading1.value = false;
      emit("writeCardSuc");
      return;
    }
    switch (props.handleType) {
      case 1:
        ElMessage.success("发卡成功");
        break;
      case 2:
        ElMessage.success("换卡成功");
        break;
      case 3:
        ElMessage.success("激活成功");
        break;
      default:
        break;
    }
    loading.value = false;
    emit("writeCardSuc");
  } catch (error) {
    console.log(error);
    loading.value = false;
    loading1.value = false;
    console.log(error);
  }
};
</script>
<style lang="scss" scoped>
.userCardInfo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 20px;
  margin-bottom: 10px;
  .userCardInfo__avatar {
    width: 90px;
    height: 90px;
    margin-right: 10px;
    margin-bottom: 18px;
    background: #eeeeee;
    border: 1px solid #eeeeee;
    border-radius: 50%;
  }
  .userCardInfo__con {
    flex: 1;
  }
}
</style>
